<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>知识库新增</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="format-detection" content="telephone=no">
		<!-- jQuery-->
		<script type="text/javascript" src="/static/plugins/jquery/jquery-3.6.0.min.js"></script>

		<!-- layui-->
		<link rel="stylesheet" href="/static/plugins/layui/2.8.4/css/layui.css" media="all">
		<script src="/static/plugins/layui/2.8.4/layui.js" charset="utf-8"></script>
		
		
	</head>
	<style>
		.all-view{
			width: 90%;
			margin: 0 auto;
			margin-top: 20px;
		}
		.btn-view{
			margin-bottom: 10px;
			
		}
		.add-btn{
			width:120px;
		}
		.bottom-view{
			position: fixed;
			bottom: 0;
			width: 100%;
		}
		.add-btn-view{
			width: 260px;
			margin: 0 auto;
			margin-bottom: 20px;
		}
		.layui-form-switch {
			margin-top: -3px !important;
		}
	</style>
	
	<body>
		
		<!--头部输入框-->
		
		<form class="layui-form layui-form-pane all-view" action="">

			<!--
			<div class="layui-form-item">
				<label class="layui-form-label">知识库名称</label>
				<div class="layui-input-block">
				  <input type="text" name="username" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
				</div>
			  </div>
-->

			<div class="layui-form-item">
				<label class="layui-form-label">选择分类</label>
				<div class="layui-input-block">
					<select name="chooseType" id="chooseType" lay-filter="chooseType">
						<option value="">请选择</option>
						<option th:each="option: ${dto.eKnowKnowledgeTypeList}" th:value="${option.id}" th:text="${option.typeName}"></option>
					</select>
				</div>
			</div>


			<div class="layui-form-item">
				<span style="line-height: 30px;">是否去除连续的空格与换行<i class="layui-icon layui-icon-question" id="isSimpleCheckTip" style="color: #ffa33a;padding-left: 5px; cursor: pointer;" ></i>：</span>
				<input type="checkbox" name="isSimpleCheck" lay-skin="switch" lay-filter="switchIsSimple" title="是|否" checked>
			</div>

			<!--
			<div class="layui-form-item">
				<label class="layui-form-label">文本类型</label>
				<div class="layui-input-block">
				  <select name="interest" lay-filter="chooseType">
					<option value="">请选择</option>
					<option value="0" selected>泛文本</option>
					<option value="1" >问答对</option>
				  </select>
				</div>
			  </div>  
		-->
		
			<div class="layui-form-item layui-form-text" id="general-txt">
				<label class="layui-form-label">内容<i class="layui-icon layui-icon-question" id="backNum" style="color: #ffa33a;padding-left: 5px; cursor: pointer;" ></i></label>
				<div class="layui-input-block">
				  <textarea placeholder="请输入内容" class="layui-textarea" id="information" maxlength="10000" style="min-height: 300px;"></textarea>
					<div><span id="textCount">0</span>/<span id="inputMaxTxt">10000</span></div>
				</div>
			  </div>

			<!--
            <div id="QA-txt" hidden>
                <button type="button" class="layui-btn btn-view">
                   <i class="layui-icon layui-icon-add-1"></i>新增问答对
                </button>
                <div class="layui-row  layui-col-space5" >
                  <div class="layui-col-xs6">
                    <div class="layui-form-item layui-form-text" >
                        <label class="layui-form-label">问题</label>
                        <div class="layui-input-block">
                          <textarea placeholder="请输入内容" class="layui-textarea"></textarea>
                        </div>
                      </div>
                  </div>
                  <div class="layui-col-xs6">
                    <div class="layui-form-item layui-form-text" >
                        <label class="layui-form-label">答案</label>
                        <div class="layui-input-block">
                          <textarea placeholder="请输入内容" class="layui-textarea"></textarea>
                        </div>
                      </div>
                  </div>
                </div>


            </div>
            -->



      </form>



      <div class="bottom-view">
          <div class="layui-btn-container add-btn-view">
            <button type="button" class="layui-btn layui-btn-primary layui-border-blue add-btn" onclick="toAdd();">确定</button>
            <button type="button" class="layui-btn layui-btn-primary layui-border add-btn" onclick="toClose();">取消</button>
          </div>
      </div>


		<input type="hidden" name="id" id="id" value=""><!--知识库id-->
		<input type="hidden" name="typeId" id="typeId" value=""><!--所选择的类型id-->
		<input type="hidden" name="isRemoveBlank" id="isRemoveBlank" value="1"><!--是否去除连续的空格与换行，0否1是-->


      <script>
		  $('#id').val('[(${dto.id})]');

		  var tipIndex = null;
		  $("#backNum").mouseover(function() {
			  tipIndex = layer.tips("推荐以中文感叹号（！，注意区分英文感叹号!）对输入的内容进行分段，每个段落300字以内。若无分段，则系统会自动以300个字数进行分段。", this, {tips: [2, "#C1C1C1"],time:0});
		  });
		  $("#backNum").mouseout(function() {layer.close(tipIndex);});
		  $("#isSimpleCheckTip").mouseover(function() {
			  tipIndex = layer.tips("系统在分段前会自动帮你去除连续的空格、换行，建议开启。", this, {tips: [2, "#C1C1C1"],time:0});
		  });
		  $("#isSimpleCheckTip").mouseout(function() {layer.close(tipIndex);});


          layui.use(function(){
            var form = layui.form;
            var layer = layui.layer;

			  form.on('select(chooseType)', function(data){
				  //var elem = data.elem; // 获得 select 原始 DOM 对象
				  var value = data.value; // 获得被选中的值
				  //var othis = data.othis; // 获得 select 元素被替换后的 jQuery 对象
				  $('#typeId').val(value);
			  });

			  form.on('switch(switchIsSimple)', function(data){
				  var elem = data.elem; // 获得 checkbox 原始 DOM 对象
				  if(elem.checked){//是
					  $('#isRemoveBlank').val(1);
				  }else {//否
					  $('#isRemoveBlank').val(0);
				  }

			  });

            // select 事件
			  /*
            form.on('select(chooseType)', function(data){
              var elem = data.elem; // 获得 select 原始 DOM 对象
              var value = data.value; // 获得被选中的值
              var othis = data.othis; // 获得 select 元素被替换后的 jQuery 对象
              if(value==0){
                  $("#general-txt").show();
                  $("#QA-txt").hide();
              }else{
                  $("#general-txt").hide();
                  $("#QA-txt").show();
              }
            });

			   */

          });

		  function toClose() {
			  window.parent.layer.closeAll();
		  }

		  function toAdd() {
			  var id = $('#id').val();
			  var typeId = $('#typeId').val();
			  var information = $('#information').val();
			  if(typeId ==undefined || typeId ==null || typeId =='' ){
				  layer.msg('请选择分类', {icon: 0});
				  return ;
			  }
			  if(information ==undefined || information ==null || information =='' ){
				  layer.msg('请填写内容', {icon: 0});
				  return ;
			  }

			  //var layindex= layui.layer.msg('保存中', {icon: 16,shade: 0.01});
			  var layindex= layer.load(2);
			  $.ajax({
				  url: '/api/inter/knowledgeList/addOrUpdateKnowledgeList',
				  data: {
					  'addOrUpdate':'add',
					  'baseId':id,
					  'typeId':typeId,
					  'information':information,
					  'isRemoveBlank':$('#isRemoveBlank').val()
				  },
				  type: 'POST',
				  async: true,
				  timeout: 60000,
				  success: function (result) {
					  layer.close(layindex);
					  console.log('result:',result);
					  if(result.code=='SUCCESS'){
						  layer.msg("操作成功", {icon: 1});
						  setTimeout(function(){
							  window.parent.location.reload();
						  }, 1000);
					  }else if(result.code=='NOBASE'){
						  layer.close(layindex);
						  layer.msg('不好意思，未定位到知识库，请稍后重试！', {icon: 2});
					  } else{//失败
						  layer.close(layindex);
						  layer.msg('不好意思，系统出现问题了，请稍后重试！', {icon: 2});
					  }
				  }, error: function () {
					  layer.close(layindex);
					  layer.msg('不好意思，系统出现问题了，请稍后重试！', {icon: 2});
				  }
			  });
		  }


		  //输入框底下的字数变化监听
		  var el = document.getElementById('information');
		  el.addEventListener('input',function () {
			  var len =  txtCount(this); //   调用函数
			  document.getElementById('textCount').innerHTML = len;
		  });

		  //函数 - 获取文本内容和长度
		  function txtCount(el) {
			  var val = el.value;
			  var eLen = val.length;
			  return eLen;
		  }
      </script>

  </body>
</html>